// 全局 mixin（如 flex 布局、文本省略等）
// src/assets/styles/_mixins.scss

// 文本省略（单行）
@mixin text-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// 多行文本省略（需要指定行数）
@mixin multi-line-ellipsis($line: 2) {
  display: -webkit-box;
  -webkit-line-clamp: $line;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

// Flex 布局快捷方式
@mixin flex-center {
  // 浏览器兼容 后续...
  display: flex;
  justify-content: center;
  align-items: center;
}

@mixin flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@mixin flex-around {
  display: flex;
  justify-content: space-around;
  align-items: center;
}

// 固定定位 - 底部
@mixin fixed-bottom {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;



}

// 固定定位 - 顶部
@mixin fixed-top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;

}

// 绝对定位 - 居中
@mixin absolute-center($bottom: 50%, $left: 50%) {
  position: absolute;
  bottom: $bottom;
  left: $left;
  transform: translate(-50%, -50%);
  z-index: 9999;


}

// 绝对定位 - 顶部居右
@mixin absolute-top-right($top: 0, $right: 0) {
  position: absolute;
  top: $top;
  right: $right;
  z-index: 9999;
}

// 绝对定位 - 顶部居左
@mixin absolute-top-left($top: 0, $left: 0) {
  position: absolute;
  top: $top;
  left: $left;
  z-index: 9999;
}

// 绝对定位 - 底部居左
@mixin absolute-bottom-left($bottom: 0, $left: 0) {
  position: absolute;
  bottom: $bottom;
  left: $left;
  z-index: 9999;
}

// 绝对定位 - 底部居右
@mixin absolute-bottom-right($bottom: 0, $right: 0) {
  position: absolute;
  bottom: $bottom;
  right: $right;
  z-index: 9999;
}